---
export interface Props {
title: string;
description: string;
}
const { title, description } = Astro.props;
---

<header class="mx-auto max-w-xl text-center content">
  <div style="align-items: center;">
    <div style="display: flex; flex-direction:column">
      <!-- <span style="width: auto;">&nbsp;</span> -->
      <!-- <img style = "height: 100px; width: 100px; flex: 1;" src = "/images/logo.svg" /> -->
      <h1 class="mb-4" data-test="header-title">{title}</h1>
    </div>
  </div>
  <p data-test="header-description">{description}</p>
</header> 

<style>
  .h1{
    text-align: center;
  }
</style>